
<template>
    <div>
        <el-button type="primary" @click="dialogFormVisible = true">新增</el-button>
        <el-table :data="list" style="width: 100%">
            <el-table-column prop="groupId" label="小组" width="180"></el-table-column>
            <el-table-column prop="score" label=" 项分" width="180"></el-table-column>
        </el-table>

        
        <el-dialog title="小组打分" :visible.sync="dialogFormVisible">
        <el-form >
            <el-form-item label="小组" >
                <el-select v-model="groupScore.groupId" placeholder="请选择">
                    <el-option label="一组" value="1"></el-option>
                    <el-option label="二组" value="2"></el-option>
                    <el-option label="三组" value="3"></el-option>
                    <el-option label="四组" value="4"></el-option>
                </el-select>
            </el-form-item>
            <el-form :inline="true" class="demo-form-inline">
            <el-form-item label="进度">
                <el-input-number v-model="groupScore.scoreList[0].score" @change="handleChange" :min="1" :max="20" label="进度"/>
                <el-input v-model="groupScore.scoreList[0].content" placeholder="进度评价"></el-input>
            </el-form-item>
            <el-form-item label="文档">
                <el-input-number v-model="groupScore.scoreList[1].score" @change="handleChange" :min="1" :max="20" label="文档"/>
                <el-input v-model="groupScore.scoreList[1].content" placeholder="文档评价"></el-input>
            </el-form-item>
            <el-form-item label="亮点">
                <el-input-number v-model="groupScore.scoreList[2].score" @change="handleChange" :min="1" :max="20" label="亮点"/>
                <el-input v-model="groupScore.scoreList[2].content" placeholder="亮点评价"></el-input>
            </el-form-item>
            <el-form-item label="表达">
                <el-input-number v-model="groupScore.scoreList[3].score" @change="handleChange" :min="1" :max="20" label="表达"/>
                <el-input v-model="groupScore.scoreList[3].content" placeholder="表达评价"></el-input>
            </el-form-item>
            <el-form-item label="问提">
                <el-input-number v-model="groupScore.scoreList[4].score" @change="handleChange" :min="1" :max="20" label="问题及解决"/>
                <el-input v-model="groupScore.scoreList[4].content" placeholder="问题及解决评价"></el-input>
            </el-form-item>                        
                                  
            </el-form>           
        </el-form>

        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="save()">确 定</el-button>
        </div>
        </el-dialog> 

    </div>
</template>
<script>
import scoreApi from '@/api/score'

export default {
    data(){
        return {
            list:[],
            dialogFormVisible:false,
            groupScore:{
                scoreList:[
                    {optionId:1,score:20,content:""},
                    {optionId:2,score:20,content:""},
                    {optionId:3,score:20,content:""},
                    {optionId:4,score:20,content:""},
                    {optionId:5,score:20,content:""}
                ],
            },//组合实体类
            num: 20,
        }
    },
    created(){
        this.fetchData();
    },
    methods:{
        fetchData(){
            scoreApi.scoresByUser().then(response => {
                this.list=response.data;
            });
        },
        handleChange(value) {
        },
        save(){
            scoreApi.add(this.groupScore).then(response => {
                this.dialogFormVisible = false;
                this.$message({
                    message: response.message,
                    type: (response.flag?'success':'error')
                });                
                this.fetchData();
            })
        }
    }
}
</script>